<template>
  <div class="suggestTable">
    <div style="width: 100%">
      <div style="display: flex">
        <div v-if="operation">
          <el-button type="danger" @click="handleQian"> 签收 </el-button>
          <el-button type="warning" @click="bianGengVisible = true">
            申请变更承办
          </el-button>
        </div>
        <div style="margin-left: 20px" v-if="form.status == 6">
          <el-button type="primary"> 下载 </el-button>
          <el-button type="primary"> 打印 </el-button>
        </div>
      </div>
      <div style="width: 50%; margin: 0 auto">
        <el-steps :active="active" class="stepsStyle">
          <el-step title="起草"></el-step>
          <el-step title="核对/更改"></el-step>
          <el-step title="交办"></el-step>
          <el-step title="承办"></el-step>
          <el-step title="办结"></el-step>
        </el-steps>
      </div>

      <h4
        style="text-align: right; color: #555; margin: 20px 30px 20px 0"
        v-if="newJieCi"
      >
        <span
          style="
            display: inline-block;
            font-weight: bold;
            text-align: center;
            color: red;
          "
          >{{ newJieCi.area }}</span
        >第<span
          style="
            display: inline-block;
            font-weight: bold;
            text-align: center;
            color: red;
          "
          >{{ newJieCi.session }}</span
        >届人民代表大会第<span
          class="red"
          style="
            display: inline-block;
            font-weight: bold;
            text-align: center;
            color: red;
          "
          >{{ newJieCi.orderName }}</span
        >次会议
      </h4>
    </div>
    <div class="tittle">
      <h1>富县人民代表大会代表建议批评和意见</h1>
      <h1>
        第
        <el-input
          v-model="form.number"
          :disabled="showDis"
          class="title-input"
          style="width: 200px; border-bottom: 1px solid #000"
        ></el-input>
        号[
        <el-input
          v-model="form.type"
          class="title-input"
          :disabled="showDis"
          style="width: 200px; border-bottom: 1px solid #000"
        ></el-input
        >类]
      </h1>
    </div>
    <div style="display: flex; justify-content: flex-end; padding: 0 30px">
      <el-radio
        v-model="form.submitStatus"
        :disabled="showDis"
        label="1"
        value="1"
        >大会期间提出的建议</el-radio
      >
      <el-radio
        v-model="form.submitStatus"
        :disabled="showDis"
        label="0"
        value="0"
        >闭会间提出的建议</el-radio
      >
    </div>
    <el-form ref="form" :model="form" style="padding: 20px">
      <table class="tables">
        <!-- 新建建议 -->
        <tr>
          <td class="tabletitt">代表姓名<span style="color: red">*</span></td>
          <td>
            <el-form-item>
              <el-input
                v-model="userForm.userName"
                placeholder="请输入代表姓名"
                @focus="handleFocus"
                :disabled="showDis"
              ></el-input>
            </el-form-item>
          </td>
          <td class="tabletitt">选举单位</td>
          <td>
            <el-form-item>
              <el-input
                v-model="userForm.deName"
                placeholder="请输入选举单位"
                :disabled="showDis"
              ></el-input>
            </el-form-item>
          </td>
        </tr>

        <!-- 新建建议 -->
        <tr>
          <td class="tabletitt">代表证号</td>
          <td>
            <el-form-item>
              <el-input
                v-model="userForm.num"
                placeholder="请输入代表证号"
                :disabled="showDis"
              ></el-input>
            </el-form-item>
          </td>
          <td class="tabletitt">邮政编码</td>
          <td>
            <el-form-item>
              <el-input
                v-model="userForm.num"
                placeholder="请输入邮政编码"
                :disabled="showDis"
              ></el-input>
            </el-form-item>
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr>
          <td class="tabletitt">通讯地址<span style="color: red">*</span></td>
          <td>
            <el-form-item>
              <el-input
                v-model="userForm.homeAddress"
                placeholder="请输入通讯地址"
                :disabled="showDis"
              ></el-input>
            </el-form-item>
          </td>
          <td class="tabletitt">联系电话</td>
          <td>
            <el-form-item>
              <el-input
                v-model="userForm.phone"
                placeholder="请输入通讯地址"
                :disabled="showDis"
              ></el-input>
            </el-form-item>
          </td>
        </tr>
        <tr>
          <td class="tabletitt">建议类型<span style="color: red">*</span></td>
          <td colspan="3">
            <el-form-item>
              <el-select
                v-model="form.type"
                placeholder="请选择学历"
                style="width: 100%"
              >
                <el-option
                  v-for="dict in dict.type.sys_jianyi_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr>
          <td class="tabletitt">题目<span style="color: red">*</span></td>
          <td colspan="3">
            <el-form-item>
              <el-input
                v-model="form.title"
                placeholder="请输入题目"
                :disabled="showDis"
              ></el-input>
            </el-form-item>
          </td>
        </tr>
        <!-- 核对 -->
        <tr v-if="active > 2">
          <td class="tabletitt">是否重点<span style="color: red">*</span></td>
          <td>
            <el-form-item>
              <el-radio-group
                v-model="proForm.chIsImportant"
                placeholder="请输入交办意见"
                clearable
                size="small"
                style="margin-left: 10px"
                :disabled="showDis || active > 2"
              >
                <el-radio key="1" label="是" value="1" />
                <el-radio key="0" label="否" value="0" />
              </el-radio-group>
            </el-form-item>
          </td>
          <td class="tabletitt">督办领导</td>
          <td>
            <el-form-item>
              <el-input
                v-model="proForm.chUserName"
                placeholder="请输入督办领导"
                :disabled="showDis || active > 2"
              ></el-input>
            </el-form-item>
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr>
          <td class="tabletitt" style="border-right: none">内容</td>
          <td colspan="4"></td>
        </tr>
        <!-- 新建建议 -->
        <tr>
          <td colspan="4">
            <editor
              v-model="form.content"
              :min-height="192"
              :disabled="showDis"
            />
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr class="proposal">
          <td class="tabletitt">附&nbsp;&nbsp;&nbsp;&nbsp;件</td>
          <td colspan="3">
            <div style="padding: 20px">
              <!-- <el-button type="primary"> 选择多文件 </el-button> -->
              <FileUpload
                v-model="fileManager"
                :uploadUrl="uploadUrl"
                type="suggest"
                @getSuggestFile="getSuggestFile"
                :disabled="showDis"
              ></FileUpload>
            </div>
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr>
          <td class="tabletitt">备注</td>
          <td colspan="3">
            <el-input
              v-model="form.remark"
              placeholder="请输入备注"
              :disabled="showDis"
            ></el-input>
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr>
          <td colspan="4" class="textline">
            <div></div>
            <p class="red">一、一事一件</p>
            <p class="red">二、如不需要答复,请在备注栏说明</p>
            <p class="red">三、交办意见不要填写</p>
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr>
          <td
            class="tabletitt"
            colspan="6"
            style="text-align: left; padding-left: 30px"
          >
            <!-- <button type="button" class="layui-btn" id="namebutt">提建议批评和意见人</button> -->
            <b>提建议批评和意见人</b>
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr class="namebutt">
          <td colspan="4" style="padding: 5px 0">
            <table class="namebutt-table">
              <colgroup>
                <col />
                <col />
                <col />
                <col />
                <col />
                <col />
                <col />
              </colgroup>
              <thead>
                <tr>
                  <th style="display: none"></th>
                  <th style="width: 20%">领衔代表姓名</th>
                  <th style="width: 15%">代表证号</th>
                  <th style="width: 15%">代表团</th>
                  <th style="width: 30%">通讯地址</th>
                  <th style="display: none">邮政编码</th>
                  <th>联系电话</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td style="display: none">
                    <el-input
                      v-model="userForm.userName"
                      style="width: 80%"
                      placeholder="请输入代表姓名"
                      :disabled="showDis"
                    ></el-input>
                  </td>
                  <td>
                    <el-input
                      v-model="userForm.userName"
                      style="width: 80%"
                      placeholder="请输入代表姓名"
                      :disabled="showDis"
                    ></el-input>
                  </td>
                  <td>
                    <el-input
                      v-model="userForm.num"
                      placeholder="请输入代表证号"
                      :disabled="showDis"
                    ></el-input>
                  </td>
                  <td>
                    <el-input
                      v-model="userForm.deName"
                      placeholder="请输入代表团"
                      :disabled="showDis"
                    ></el-input>
                  </td>
                  <td>
                    <el-input
                      v-model="userForm.homeAddress"
                      placeholder="请输入通讯地址"
                      :disabled="showDis"
                    ></el-input>
                  </td>
                  <td>
                    <el-input
                      v-model="userForm.phone"
                      placeholder="请输入联系电话"
                      :disabled="showDis"
                    ></el-input>
                  </td>
                  <td style="display: none">
                    <el-input
                      v-model="userForm.phone"
                      placeholder="请输入联系电话"
                      :disabled="showDis"
                    ></el-input>
                  </td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
        <!-- 新建建议 -->
        <tr class="namebutt">
          <td colspan="4" style="padding: 10px 0">
            <table class="namebutt-table">
              <colgroup>
                <col />
                <col />
                <col />
                <col />
                <col />
                <col />
                <col />
              </colgroup>
              <thead>
                <tr>
                  <th style="display: none"></th>
                  <th style="width: 20%">附议代表姓名</th>
                  <th style="width: 15%">代表证号</th>
                  <th style="width: 15%">代表团</th>
                  <th style="width: 30%">通讯地址</th>
                  <th style="display: none">邮政编码</th>
                  <th>联系电话</th>
                  <th>
                    <div>
                      <el-button
                        type="primary"
                        @click="addFuYi"
                        v-if="!showDis"
                      >
                        添加附议代表
                      </el-button>
                    </div>
                  </th>
                </tr>
              </thead>
              <tbody id="nametable">
                <tr v-for="(item, index) in FuYiList" :key="index">
                  <td>
                    {{ item.userName }}
                  </td>
                  <td>{{ item.num }}</td>
                  <td>
                    {{ item.delegation.name }}
                  </td>
                  <td>
                    {{ item.homeAddress }}
                  </td>
                  <td>
                    {{ item.phone }}
                  </td>
                  <td>
                    <el-button
                      size="mini"
                      type="danger"
                      @click="handleDelete(item, index)"
                      style="padding: 4px 6px"
                      v-if="!showDis"
                      >删除</el-button
                    >
                  </td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
        <!-- 交办建议 -->
        <tr v-if="active > 3">
          <td
            colspan="4"
            class="tabletitt"
            style="text-align: left; padding-left: 30px"
          >
            <b style="color: red">交办意见</b>
          </td>
        </tr>
        <!-- 交办建议 -->
        <tr v-if="active > 3">
          <td colspan="4" class="textline">
            <table class="namebutt-table">
              <colgroup>
                <col style="width: 200px" />
                <col />
                <col />
                <col />
                <col />
              </colgroup>
              <tbody>
                <input type="hidden" name="id" value="1092" />
                <tr>
                  <td class="tabletitt" style="font-weight: bold">承办单位</td>
                  <td colspan="4">
                    <div>
                      <el-input
                        v-model="jiaoBanForm.deptId"
                        placeholder="请输入承办单位"
                        :disabled="true"
                      ></el-input>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td class="tabletitt" style="font-weight: bold">交办意见</td>
                  <td colspan="4">
                    <el-input
                      v-model="jiaoBanForm.asSuggest"
                      placeholder="请输入交办意见"
                      :disabled="true"
                    ></el-input>
                  </td>
                </tr>

                <tr>
                  <td colspan="1" class="tabletitt" style="font-weight: bold">
                    督办单位
                  </td>
                  <td colspan="4">
                    <div>
                      <el-input
                        v-model="jiaoBanForm.chSuperviseName"
                        placeholder="请输入督办单位"
                        :disabled="true"
                      ></el-input>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td class="tabletitt" style="font-weight: bold">联系人</td>
                  <td colspan="2">
                    <div>
                      <el-input
                        v-model="jiaoBanForm.unUserName"
                        placeholder="请输入联系人"
                        :disabled="true"
                      ></el-input>
                    </div>
                  </td>
                  <td class="tabletitt" style="font-weight: bold">
                    联系人电话
                  </td>
                  <td>
                    <div>
                      <el-input
                        v-model="jiaoBanForm.unPhone"
                        placeholder="请输入联系人电话"
                        :disabled="true"
                      ></el-input>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td class="tabletitt" style="font-weight: bold">交办日期</td>
                  <td colspan="2">
                    <div>
                      <el-input
                        v-model="jiaoBanForm.asTaskSCreateTime"
                        placeholder="请输入交办日期"
                        :disabled="true"
                      ></el-input>
                    </div>
                  </td>
                  <td class="tabletitt" style="font-weight: bold">复函限期</td>
                  <td>
                    <div>
                      <el-input
                        v-model="jiaoBanForm.day"
                        placeholder="请输入复函限期"
                        :disabled="true"
                      ></el-input>
                    </div>
                  </td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
        <tr v-if="form.status >= 4">
          <td
            colspan="5"
            class="tabletitt"
            style="text-align: left; padding-left: 30px"
          >
            <b style="color: red">签收记录</b>
          </td>
        </tr>

        <tr v-if="form.status >= 4">
          <td class="tabletitt">签收单位</td>
          <td>
            <span style="margin-left: 10px">{{
              jiaoBanForm.chSuperviseName
            }}</span>
          </td>
          <td class="tabletitt">签收时间</td>
          <td>
            <span style="margin-left: 10px">{{ jiaoBanForm.signTime }}</span>
          </td>
        </tr>

        <tr>
          <td colspan="4">
            <div
              style="padding: 10px 0; display: flex; justify-content: center"
            >
              <el-button type="primary" @click="submit" v-if="active == 1">
                立即提交
              </el-button>
              <el-button
                type="primary"
                @click="updateSubmit"
                v-if="active == 2 && type == 'writeable'"
              >
                确认修改
              </el-button>

              <el-button v-if="active == 1"> 返回 </el-button>
            </div>
          </td>
        </tr>
      </table>
    </el-form>
    <userDialog
      v-if="userVisible"
      v-model="userVisible"
      :type="DialogType"
      @submit="handleSubmit"
    ></userDialog>
    <bianGeng v-if="bianGengVisible" v-model="bianGengVisible" :proId="proId">
    </bianGeng>
  </div>
</template>
<script>
import userDialog from "./userDialog.vue";

import { getUser } from "@/api/system/user";
import {
  processInfoProId,
  updateProcessInfo,
  userListByRoleId,
  processInfo,
  suggest,
  delFollowerUserInfo,
  fileManager,
  followerUserInfo,
} from "@/api/suggest/index";
import bianGeng from "./bianGeng.vue";
import { addCount } from "@/api/dbxx/statistics";
export default {
  dicts: ["sys_jianyi_type"],
  components: {
    userDialog,
    bianGeng,
  },
  props: {
    type: {
      type: String,
      default: "writeable",
    },
    proId: {
      type: String,
      default: null,
    },
    operation: {
      type: String,
      default: null,
    },
    add: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      form: {
        number: undefined,
        type: undefined,
        title: undefined,
        content: undefined,
        annex: undefined,
        remark: undefined,
        userId: undefined,
        leaderId: undefined,
        submitStatus: undefined,
        followerUsers: [],
        fileManagers: [],
        proId: undefined,
      },
      userForm: {
        userName: undefined,
        deId: undefined,
        deName: undefined,
        num: undefined,
        homeAddress: undefined,
        phone: undefined,
      },
      proForm: {
        chIsImportant: undefined,
        chUserName: undefined,
      },
      jiaoBanForm: {
        asTaskSCreateTime: undefined,
        asTaskSEndTime: undefined,
        asTaskRCreateTime: undefined,
        asTaskREndTime: undefined,
        asTaskECreateTime: undefined,
        asTaskEEndTime: undefined,
        deptId: undefined,
        chSuperviseName: undefined,
        asSuggest: undefined,
        unUserName: undefined,
        unPhone: undefined,
        day: undefined,
        signTime: undefined,
      },
      userVisible: false,
      duBanVisible: false,
      bianGengVisible: false,
      active: 1,
      uploadUrl:
        process.env.VUE_APP_BASE_API + "/system/user/profile/avatar/local",
      FuYiList: [],
      fileManager: [],
      showDis: false,
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      newJieCi: null,
    };
  },
  created() {
    this.showDis = this.type == "readOnly" ? true : false;
    this.proId != null && this.getProDetail(this.proId);
    addCount().then((res) => {
      res.rows.forEach((item) => {
        if (item.tenure.isSession == 1) {
          // this.newJieCi =
          //   item.tenure.area +
          //   `第${item.tenure.session}届人民代表大会` +
          //   `第${item.tenure.orderName}次会议` +
          //   `(${item.tenure.annual})`;
          this.newJieCi = item.tenure;
        }
      });
    });
  },
  methods: {
    /**
     * @description: 表单详情
     * @param {*} proId
     * @return {*}
     */
    getProDetail(proId) {
      processInfoProId(proId).then((res) => {
        //代表信息和领衔代表信息
        res.data.suggestInfo.leaderUser &&
          Object.keys(this.userForm).forEach((key) => {
            if (key == "deName") {
              this.userForm[key] =
                res.data.suggestInfo.leaderUser.delegation.name;
            } else {
              this.userForm[key] = res.data.suggestInfo.leaderUser[key];
            }
          });
        //建议基本信息
        res.data.suggestInfo &&
          Object.keys(this.form).forEach((key) => {
            this.form[key] = res.data.suggestInfo[key];
          });
        //建议进程信息
        res.data &&
          Object.keys(this.proForm).forEach((key) => {
            this.proForm[key] = res.data[key];
          });
        //建议进程Id
        this.form.proId = res.data.proId;
        this.form.status = res.data.status;
        //建议Id
        this.form.suId = res.data.suId;
        //附议列表
        this.FuYiList = res.data.suggestInfo.followerUsers.map((item) => {
          item.followerUser.id = item.id;
          return item.followerUser;
        });
        //文件列表
        this.fileManager = res.data.suggestInfo.fileManagers;
        //交办信息
        if (res.data.chSuperviseId) {
          this.jiaoBanForm.chSuperviseName = res.data.chSuperviseUser.nickName;
        }
        if (res.data.deptId) {
          this.jiaoBanForm.deptId = res.data.deptUser.nickName;
          this.jiaoBanForm.asSuggest = res.data.asSuggest;
          this.jiaoBanForm.unUserName = res.data.unUserName;
          this.jiaoBanForm.unPhone = res.data.unPhone;
          this.jiaoBanForm.asTaskSCreateTime = this.parseTime(
            res.data.asTaskSCreateTime,
            "{y}-{m}-{d}"
          );
          this.jiaoBanForm.asTaskEEndTime = this.parseTime(
            res.data.asTaskEEndTime,
            "{y}-{m}-{d}"
          );
          this.jiaoBanForm.signTime = this.parseTime(
            res.data.signTime,
            "{y}-{m}-{d}"
          );
          var result =
            new Date(res.data.asTaskEEndTime).getTime() -
            new Date(res.data.asTaskSCreateTime).getTime();
          this.jiaoBanForm.day = Math.floor(result / (24 * 3600 * 1000));
        }
        //核对状态
        if (res.data.status == 0 || res.data.status == 3) {
          this.active = 2;
        }
        //交办状态
        if (res.data.status == 1) {
          this.active = 3;
        }
        //承办状态
        if (
          res.data.status == 2 ||
          res.data.status == 4 ||
          res.data.status == 5
        ) {
          this.active = 4;
        }
        if (res.data.status == 6) {
          this.active = 5;
        }
      });
    },
    /**
     * @description: 获取代表信息弹窗
     * @return {*}
     */
    handleFocus() {
      this.DialogType = "GeRen";
      this.userVisible = true;
    },
    /**
     * @description: 获取附议信息弹窗
     * @param {*} value
     * @param {*} type
     * @return {*}
     */
    handleSubmit(value, type) {
      if (type == "FuYi") {
        if (this.add == "true") {
          value.forEach((item) => {
            followerUserInfo({ suId: this.proId, userId: item.userId }).then(
              (res) => {}
            );
          });
          //
        }
        this.FuYiList = this.FuYiList.concat(value);
        let map = new Map();
        for (let item of this.FuYiList) {
          if (!map.has(item.userId)) {
            map.set(item.userId, item);
          }
        }
        this.FuYiList = [...map.values()];

        this.getFollowerUsers();
      } else {
        this.form.userId = value[0].userId;
        this.form.leaderId = value[0].userId;
        Object.keys(this.userForm).forEach((key) => {
          if (key == "deName") {
            this.userForm[key] = value[0].delegation.name;
          } else {
            this.userForm[key] = value[0][key];
          }
        });
      }
    },
    /**
     * @description: 附议删除按钮
     * @param {*} index
     * @return {*}
     */
    handleDelete(item, index) {
      if (this.add == "true") {
        delFollowerUserInfo(item.id);
      }
      this.FuYiList.splice(index, 1);
      this.getFollowerUsers();
    },
    /**
     * @description: 添加附议代表
     * @return {*}
     */
    addFuYi() {
      this.DialogType = "FuYi";
      this.userVisible = true;
    },
    /**
     * @description: 文件选择的回调函数
     * @param {*} files
     * @return {*}
     */
    getSuggestFile(files) {
      console.log(files);
      if (this.add == "true") {
        files.forEach((item) => {
          fileManager({ suId: this.proId, ...item }).then((res) => {});
        });
      }
      this.form.fileManagers = files;
    },
    /**
     * @description: 构建附议人列表
     * @return {*}
     */
    getFollowerUsers() {
      this.form.followerUsers = this.FuYiList.map((item) => {
        return {
          userId: item.userId,
        };
      });
    },
    /**
     * @description: 新建建议
     * @return {*}
     */
    submit() {
      processInfo({ ...this.form }).then(() => {
        this.$message.success("提交成功");
        this.$router.push({ path: "/suggest/mySuggest" });
      });
    },
    /**
     * @description: 修改建议
     * @return {*}
     */
    updateSubmit() {
      suggest({ ...this.form, followerUsers: [], fileManagers: [] }).then(
        () => {
          this.$message.success("修改成功");
          this.$router.push({ path: "/suggest/inventorySuggest" });
        }
      );
    },
    handleQian() {
      updateProcessInfo({
        status: 4,
        proId: this.proId,
        signTime: this.parseTime(new Date(), "{y}-{m}-{d}"),
      }).then((res) => {
        this.$message.success("签收成功");
        this.$router.push({ path: "/suggest/undertakeSuggest" });
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.suggestTable {
  width: 100%;
  padding: 40px;
  ::v-deep .el-input__inner {
    border: none;
  }
}
.tittle {
  margin: 50px 0 50px;
  text-align: center;
  line-height: 44px;
  font-size: 24px;
  font-weight: 550;
}

.tables {
  width: 100%;
  font-size: 16px;
  color: #666;
  border-top: 1px solid #bbb;
  border-left: 1px solid #bbb;
}

.tables td {
  border-bottom: 1px solid #bbb;
  border-right: 1px solid #bbb;
}

.tables tr {
  height: 50px;
}

.tabletitt {
  text-align: center;
}

.layui-upload {
  padding: 10px;
  margin-bottom: 20px;
}
.threeinput input {
  display: inline-block;
  width: 19%;
  padding-left: 10px;
}

.fatinput {
  width: 60%;
}

.sub {
  width: 275px !important;
  margin: 15px auto 0;
}
@media screen and (max-width: 1200px) {
  .tabletitt {
    width: 80px;
  }
  .threeinput input {
    display: block;
    width: 99%;
    margin: 5px 0;
  }
  .threeinput .fatinput {
    display: block;
    width: 99%;
  }
  .layui-input-inline {
    padding-left: 10px !important;
  }
}

@media screen and (max-width: 750px) {
  .tabletitt {
    width: 50px;
  }
  .layui-input-inline {
    padding-left: 5px !important;
  }
}

.namebutt-table {
  width: 100%;
}
.namebutt-table th {
  border-width: 1px;
  border-style: solid;
  border-color: #dcd8d8;
}
.namebutt-table td {
  text-align: center;
}
.namebutt-table tbody tr:hover,
.namebutt-table thead tr {
  background-color: #f2f2f2 !important;
}
.textline p {
  margin: 10px 0 10px 10px;
  font-weight: bold;
  color: #777;
}
.textline .red {
  color: red;
}
::v-deep .el-radio__input.is-checked .el-radio__inner {
  border-color: #1890ff;
  background: #1890ff;
}
::v-deep .el-radio__input.is-disabled.is-checked .el-radio__inner::after {
  background: #fff;
}
::v-deep .el-radio__input.is-disabled + span.el-radio__label {
  color: #000;
}
::v-deep .el-input.is-disabled .el-input__inner {
  color: #000;
}
::v-deep .el-input.is-disabled .el-input__inner {
  background: #fff !important;
}
::v-deep .el-form-item {
  margin-bottom: 0px;
}
::v-deep .title-input .el-input__inner {
  font-size: 31px;
  text-align: center;
  color: #000;
}
.stepsStyle {
  width: 100%;
  ::v-deep {
    .el-step__title.is-process,
    .el-step__title.is-wait {
      color: #c0c4cc !important;
      font-weight: 500 !important;
    }
    .el-step__head.is-process,
    .el-step__heads.is-wait {
      .el-step__icon.is-text {
        //这里设置的是下一步和等待状态里的文字颜色
        color: #c0c4cc !important;

        border-color: #c0c4cc !important;
      }
    }
    .el-step__head.is-finish {
      color: orange !important;
      .el-step__icon.is-text {
        //这里设置的是已完成状态里的文字颜色
        color: #fff !important;
        border-color: #c81616 !important;
        background: #c81616;
      }
    }
    .el-step__icon {
      width: 40px;
      height: 40px;
    }
    .el-step.is-horizontal .el-step__line {
      top: 20px;
    }
    .el-step__icon-inner {
      font-weight: 500;
      font-size: 20px;
    }
    .el-step__title.is-finish {
      color: #c81616 !important;
    }
    .el-step__line-inner {
      //这里设置的是完成后过渡线条颜色
      border-color: #c81616 !important;
    }
    .el-step__head.is-success,
    .el-step__title.is-success {
      //这里设置的是完成后的颜色
      color: #c81616 !important;
    }
  }
}
</style>
